<#include "/_inc/_layout.ftl">
<#assign allowExport=helper.isAuthorize("SystemLog.Export")/>
<@header/>
<div id="gridtoolbar">
    <form id="gridform" class="jxform jxlayout-form form-inline">
        <input type="hidden" id="operateType" name="operateType" value="1"/>
        <div class="form-group ml-5">
            <input class="form-control w-200px" name="operateUserName" placeholder="请输入操作人">
        </div>
        <div class="form-group ml-5">
            <div id="time-horizon" class="btn-group">
                <a class="btn btn-default" data-value="1">今天</a>
                <a class="btn btn-default" data-value="2">近7天</a>
                <a class="btn btn-default" data-value="3">近1个月</a>
                <a class="btn btn-default" data-value="4">近3个月</a>
                <a class="btn btn-default" data-value="5" data-toggle="popover-x"
                   data-placement="auto-bottom" data-target="#griddate-popover">
                    自定义
                </a>
            </div>
        </div>
        <div class="form-group">
            <a class="btn btn-default" data-target="#gridadvform-popover"
               data-toggle="popover-x" data-placement="auto-bottom">
                <i class="fa fa-th"></i> 高级查询
            </a>
        </div>
        <button class="btn btn-primary ml-5" type="submit">
            <i class="fa fa-search"></i> 查询
        </button>
        <@html.echo test=allowExport>
            <a id="btn-export" class="btn btn-default">
                <i class="icon-share-alt"></i> 导出
            </a>
        </@html.echo>
    </form>
    <div class="jxtabs-line border-top-gray" style="margin-bottom: 2px;">
        <ul class="nav nav-tabs">
            <li class="active" data-value="1">
                <a data-toggle="tab">登录日志</a>
            </li>
            <li data-value="2">
                <a data-toggle="tab">操作日志</a>
            </li>
            <li data-value="3">
                <a data-toggle="tab">授权日志</a>
            </li>
            <li data-value="4">
                <a data-toggle="tab">访问日志</a>
            </li>
            <li data-value="5">
                <a data-toggle="tab">异常日志</a>
            </li>
            <li data-value="">
                <a data-toggle="tab">全部</a>
            </li>
        </ul>
    </div>
</div>
<div id="griddate-popover" class="popover popover-x popover-default popover-lg">
    <div class="arrow"></div>
    <form id="griddateform" class="jxform form-horizontal">
        <div class="popover-title">
            <span class="close" data-dismiss="popover-x">&times;</span>日期段过滤
        </div>
        <div class="popover-content">
            <div class="form-group">
                <label class="col-md-3 control-label">开始日期</label>
                <div class="col-md-8">
                    <div class="input-group date jxdate" data-options="endDate: '0d'">
                        <input id="operateStartDateTime" name="operateStartDateTime" class="form-control"
                               data-validate="{required: [true,'请选择开始日期']}" autocomplete="off">
                        <span class="input-group-addon">
                            <i class="fa fa-calendar"></i>
                        </span>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <label class="col-md-3 control-label">结束日期</label>
                <div class="col-md-8">
                    <div class="input-group date jxdate" data-options="endDate: '0d'">
                        <input id="operateEndDateTime" name="operateEndDateTime" class="form-control"
                               data-validate="{required: [true,'请选择结束日期'],compareEqualDate:'#operateStartDateTime'}" autocomplete="off">
                        <span class="input-group-addon">
                            <i class="fa fa-calendar"></i>
                        </span>
                    </div>
                </div>
            </div>
        </div>
        <div class="popover-footer">
            <button id="btn-datesearch" type="button" class="btn btn-success">确定</button>
        </div>
    </form>
</div>
<div id="gridadvform-popover" class="popover popover-x popover-default popover-lg">
    <div class="arrow"></div>
    <form id="gridadvform" class="jxform form-horizontal">
        <div class="popover-title">
            <span class="close" data-dismiss="popover-x">&times;</span>高级查询
        </div>
        <div class="popover-content">
            <div class="form-group">
                <label class="col-md-3 control-label">IP地址</label>
                <div class="col-md-8">
                    <input class="form-control" name="ipAddress">
                </div>
            </div>
            <div class="form-group">
                <label class="col-md-3 control-label">功能模块</label>
                <div class="col-md-8">
                    <input class="form-control" name="module">
                </div>
            </div>
        </div>
        <div class="popover-footer">
            <button type="reset" class="btn btn-default">重置</button>
            <button id="btn-advsearch" type="button" class="btn btn-success">确定</button>
        </div>
    </form>
</div>
<table id="grid" class="jxgrid" title="<i class='jxfs'></i> 系统日志"
       data-options="form:'#gridform,#griddateform,#gridadvform',toolbar:'#gridtoolbar'">
    <thead>
    <tr>
        <th data-options="title: '操作类型', field: 'operateType', width: 80, align: 'center',formatter: jx.gf.type"></th>
        <th data-options="title: '操作时间', field: 'operateDateTime', width: 170, align: 'center',sortable: true"></th>
        <th data-options="title: '操作用户', field: 'operateUserName', width: 100, align: 'center'"></th>
        <th data-options="title: '结果', field: 'result', width: 60, align: 'center', formatter: jx.gf.result"></th>
        <th data-options="title: '耗时', field: 'costTime', width: 100, align: 'center', sortable: true, formatter: jx.gf.costTime"></th>
        <th data-options="title: '模块', field: 'module', width: 140, align: 'center'"></th>
        <th data-options="title: '环境', field: 'browser', width: 180"></th>
        <th data-options="title: '请求地址', field: 'url', width: 200"></th>
        <th data-options="title: '消息', field: 'message', width: 400"></th>
        <th data-options="title: 'IP地址', field: 'ipAddress', width: 150"></th>
    </tr>
    </thead>
</table>
<@footer>
    <script src="<@html.url '/auth/js/log.js'/>"></script>
</@footer>